<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>05-综合练习</title>
    <style>
        h2 {
            /* text-align: center;居中 */
            text-align: center;
        }
        table{
            /* 合并边框 */
            border-collapse: collapse;
            height: 80px;
            /* 表格居中 */
            margin: 0 auto;
            /* 内容居中 */
            text-align: center;
        }
        th{
            /* 表格上下5px 左右35px th改变td一起变 */
            padding: 5px 35px;
        }
        table,th,td{
            /* border: 加黑框; */
            border: 1px solid #000
        }
    </style>
</head> 
<body>
    <h2>订单确认</h2>
    <script>
        // 用户输入
        let price = +prompt('输入商品价格')
        let num = +prompt('请输入商品数量')
        let address = prompt('请输入收获地址')
        // 计算总价
        let zongjia = price * num
       // 打印
       document.write(`
          <table>
        <tr>
            <th>商品名称</th>
            <th>商品价格</th>
            <th>商品数量</th>
            <th>总价</th>
            <th>收货地址</th>
        </tr>
        <tr>199
            <td>小米手机青春版</td>
            <td>${price}元</td>
            <td>${num}</td>
            <td>${zongjia}元</td>
            <td>${address}</td>
        </tr>
    </table>
       `)
    </script> 
</body>